<template>
  <div class="index">
   
    <!-- 二级路由的占位组件 -->
    <router-view></router-view>

    <div class="tabbar">
   
      <router-link to="/index/home">首页</router-link>
         <router-link to="/index/bbt">爆爆团</router-link>
      <router-link to="/index/order">订单</router-link>
      <router-link to="/index/mine">我的</router-link>

        <!-- <van-tabbar route v-model="active" active-color="#f00">
      <van-tabbar-item icon="home-o" to="/index/home">首页</van-tabbar-item>
      <van-tabbar-item icon="friends-o" to="/index/order">订单</van-tabbar-item>
      <van-tabbar-item icon="location-o" to="/index/mine">我的</van-tabbar-item>
    </van-tabbar> -->

    </div>
  </div>
</template>

<script>
export default {
  data(){
    return {
      arr:[]
    }
  },
  mounted(){
    
  }
}
</script>

<style lang='scss' scoped>
.tabbar{
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 10px 0;
  border-top: 1px solid #ccc;
}

.tabbar{
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  bottom: 0;
  width: 100%;
  padding: 10px 0;
  border-top: 1px solid #ccc;
}
</style>